<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" xml:lang="en">
<head>
   <!-- content="text/html;charset=ISO-8859-15" -->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	  <!-- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> -->
    <title>DARTIES - Tableau de bord du directeur commercial</title>

	<link rel="stylesheet" href="../styles/style.css" type="text/css" media="screen" />
	
    <script type="text/javascript" src="../js/script.js"></script>
	<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script> 
	<!--<script type="text/javascript" src="../js/menu.js"></script> -->
	<script type="text/javascript" src="../js/tablesorter.js"></script> 
	
	<!-- Pour les graphiques en JQuery -->

	<script type="text/javascript" src="../js/highcharts.js" ></script>
	<script type="text/javascript" src="../js/adapters/mootools-adapter.js" ></script>
	

	
	
		<!-- Pour les graphiques en JQuery: Le Chiffre d'affaires  -->

	
	
	
	<script type="text/javascript">
		window.onload = function(){
				$("#myTable1").tablesorter();
				$("#myTable2").tablesorter();
			g_globalObject = new JsDatePick({
				useMode:1,
				isStripped:true,
				target:"calendrier"
			});		
			
			g_globalObject.setOnSelectedDelegate(function(){
			});
		};
	</script>
</head>
<body> 
	<div id="page" style="height:2270px;">
		<div id="header">
		
		<!--  -->
			<div id="utilisateur">Le Grand Ronan<a href="../index.html" >Déconnexion</a></div>
			
			
			

			
			<div class="cleared"></div>
			<div id="logo-darties">&nbsp </div>
			<div id="site-titre">
				<p class = "titre"><a href="#">Tableau de bord </a></p>
				<p class= "detail">Direction commercial</p>
			</div>
			<div id="logo-iut">&nbsp </div>
			<div id="date_modification">Dernière modification 7 janvier 2012</div>
		
</div> <!-- Fin Div Header -->
		<!-- Onglets -->
		<!-- <ul id="onglets">
			<li>
				<a href="page.html" title ="tab1" class="active">Accueil</a>
			</li>
			<li>
				<a href="details.html" title="tab2">Détails</a>
			</li>		
			<li>
				<a href="historique.html" title="tab3">Historique</a>
			</li>
			<li>
				<a href="analyse.html" title="tab4">Analyse</a>
			</li>
			<li>
				<a href="aide.html" title="tab5">Aide</a>
			</li>
		</ul> -->
		
		
		
		<ul id="tabs">
			<li>
				<a href="index.html" title ="tab1" >Accueil</a>
			</li>
			<li>
				<a href="details.html" title="tab2">Détails</a>
			</li>		
			<li>
				<a href="historique.html" title="tab3" class="active">Historique</a>
			</li>
			<li>
				<a href="analyse.html" title="tab4">Analyse</a>
			</li>
			<li>
				<a href="aide.html" title="tab5">Aide</a>
			</li>
			<li class="options"><img src="images/header/pdf.png" title="Convertir en PDF"></li>
			<li class="options"><img src="images/header/imp.png" title="Imprimer"></li>
		</ul>
	
	
	
<!-- MIDDLE -->
		<div id= "middle">
<!-- SIDEBAR -->
			<div id="sidebar">
			
				<div class="block">
					<div class="titre">Filtres</div>
					<div class="contenu">
						<table>
							
						<tr>
								<td><span> Region:</span></td>
								<td>
									<select style="width:150px" >
										<option >Toutes régions</option>
										<option >Nord-Ouest</option>
										<option >Sud-Ouest</option>
										<option >Nord-Est</option>
										<option >Sud-Est</option>
										<option >Region parisienne</option>
									</select>
								</td>
							</tr>
							<tr>
								<td><span> Periode:</span></td>
								<td>
									<select style="width:150px">
										<option >Mois</option>
										<option >Annuel</option>										
										<option >Semestrielle</option>
									</select>
								</td>
							</tr>						
								
							<tr>
								<td><span> Mois:</span></td>
								<td>
									<select style="width:150px">											
											<option>Janvier</option>
											<option>Fevrier</option>
											<option>Mars</option>
											<option>Avril</option>
											<option>Mai</option>
											<option>Juin</option>
											<option>Juillet</option>
											<option>Aout</option>
											<option>Septembre</option>
											<option>Octobre</option>
											<option>Novembre</option>
											<option>Décembre</option>
									</select>
								</td>
							</tr>						
								
							<tr>
								<td><span> Indicateur:</span></td>
								<td>
									<select style="width:150px">
										<option >Tous indicateurs</option>
										<option >CA</option>
										<option >Marge</option>
										<option >Vente</option>
									</select>
								</td>
							</tr>	
							
							<tr>
								<td><span> Produits:</span></td>
								<td>
									<select style="width:150px" disabled>
										<option >Toutes familles</option>
										<option >Four</option>
										<option >Hifi</option>
										<option >Magneto</option>
									</select>
								</td>
							</tr>
							<tr>
								<td><span> Devise:</span></td>
								<td>
									
										<input type="radio" checked name="devise">€
										<input type="radio"  name="devise">$
									
								</td>
							</tr>								
						</table>
					</div>
				</div><!-- Fin Div Indicateurs -->		
			
			
				
		<!-- BLOCK RECHERCHE -->
				<div class="block">
					<div class="titre"> Recherche </div>
					<div class="contenu">
						<form method="get" id="newsletterform" action="javascript:void(0)">
							<input type="text" value="Recherche" name="email" id="s" style="width: 60%;" onclick="this.value=''"/>						
							<a href="#" onclick="newsletterform.submit();"><img src="../images/contenu/recherche.jpg"  height='15px'></img></a>
							<br></br>
						</form>
					</div>
				</div> <!-- Fin Div Recherche -->
		
		
				<!-- BLOCK CALENDRIER -->
				<div class="block">
					<div class="titre">Calendrier</div>
					<div class="contenu">
						<div id="calendrier" style="margin:none; width:200px; height:250px;"></div>   
					</div>
				</div> <!-- Fin Div Calendrier -->
				<div class="cleared"></div>
				
			</div><!-- Fin Div Sidebar --> 

<!-- CONTENT  -->

<script type="text/javascript">
		
			var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'historique_ca',
						defaultSeriesType: 'column'
					},
					title: {
						text: 'Comparatif des chiffre d\'affaires'
					},
					xAxis: {
						categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
					},
					tooltip: {
						formatter: function() {
							return ''+
								 this.series.name +': '+ this.y +'';
						}
					},
					credits: {
						enabled: false
					},
					series: [{
						name: 'Année -1',
						data: [306013,266013,246013,216013,246013,276013,286013,296013, 286013,286013, 296013,296013]
					}, {
						name: 'Année selectionnée',
						data: [226013,236013,246013,216013,226013,276013,286013,296013, 266013,286013, 306013,296013]
					}]
				});
				
				
			});
				
		</script>
		<script type="text/javascript">
		
			var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'historique_marges',
						defaultSeriesType: 'column'
					},
					title: {
						text: 'Comparatif des marges brutes'
					},
					xAxis: {
						categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
					},
					tooltip: {
						formatter: function() {
							return ''+
								 this.series.name +': '+ this.y +'';
						}
					},
					credits: {
						enabled: false
					},
					series: [{
						name: 'Année -1',
						data: [5, 3, 4, 7, 2, 5, 3, 4, 7, 2, 5, 3]
					}, {
						name: 'Année selectionnée',
						data: [2, 2, 3, 2, 1,5, 3, 5, 8, 2, 6, 4]
					}]
				});
				
				
			});
				
		</script>
		<script type="text/javascript">
		
			var chart;
			$(document).ready(function() {
				chart = new Highcharts.Chart({
					chart: {
						renderTo: 'historique_ventes',
						defaultSeriesType: 'column'
					},
					title: {
						text: 'Comparatif des ventes'
					},
					xAxis: {
						categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
					},
					tooltip: {
						formatter: function() {
							return ''+
								 this.series.name +': '+ this.y +'';
						}
					},
					credits: {
						enabled: false
					},
					series: [{
						name: 'Année -1',
						data: [306013,266013,246013,216013,246013,276013,286013,296013, 286013,286013, 296013,296013]
					}, {
						name: 'Année selectionnée',
						data: [226013,236013,246013,216013,226013,276013,286013,296013, 266013,286013, 306013,296013]
					}]
				});
				
			
	
			});
				
		</script>
			<div id="content">
				

</br>
	<h1>Historique des régions</h1>
	<h2>Euros / Année 2011 / Tous indicateurs / Toutes régions</h2></h2>
<table cellspacing="0" cellpadding="0" border="1" class="tablesorter" style="width:870px;" id="myTable1" >
	 <thead>
		 <tr> 
			<th rowspan="2">Region</th>
			<th colspan="2">Chiffre d'affaires réel</th>
			 <th rowspan="2">CA_%</th>
			<th colspan="2">Marge brute réelle</th>
			 <th rowspan="2">MB_%</th>
			<th colspan="2">Vente réelle</th>    
			<th rowspan="2">VTS_%</th>
		  </tr>
		  <tr>
			
			<th>2011</th>
			<th>2010</th>
			<th>2011</th>
			<th>2010</th>
			<th>2011</th>
			<th>2010</th>
			
			
		  
		  </tr>
			 </thead>
			 <tbody>
		  <tr>
			<td class="gauche">R Paris</td>
			<td>7 501,30 </td>
			<td>19 600,00 </td>
			<td>38,27%</td>
			<td>7 501,30 </td>
			<td>48,70 </td>
			<td>&nbsp;</td>
			
			<td>1 113,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  <tr>
			<td class="gauche">Nord Est</td>
			<td>52 266,90 </td>
			<td>165 370,00 </td>
			<td>269,79%</td>
			<td>52 266,90 </td>
			<td>449,50 </td>
			<td>&nbsp;</td>
			
			<td>8 317,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  <tr>
			<td class="gauche">Nord Ouest</td>
			<td>116 038,60 </td>
			<td>336 980,00 </td>
			<td>596,65%</td>
			<td>116 038,60 </td>
			<td>906,40 </td>
			<td>&nbsp;</td>
		   
			<td>20 375,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  <tr>
			<td class="gauche">Sud Est</td>
			<td>76 107,50 </td>
			<td>240 030,00 </td>
			<td>364,82%</td>
			<td>76 107,50 </td>
			<td>616,30 </td>
			<td>&nbsp;</td>
		   
			<td>13 465,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  <tr>
			<td class="gauche">Sud Ouest</td>
			<td>49 261,20 </td>
			<td>149 070,00 </td>
			<td>253,10%</td>
			<td>49 261,20 </td>
			<td>318,30 </td>
			<td>&nbsp;</td>
			
			<td>8 553,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  </tbody>
		  <tfoot>
		  <tr>
			<td>Total</td>
			<td>301    175,50 </td>
			<td>911    050,00 </td>
			<td>1522,62%</td>
			<td>301    175,50 </td>
			<td>2    339,20 </td>
			<td>&nbsp;</td>
			
			<td>51    823,00 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		  </tr>
		  </tfoot>
		</table>
		<br/>
		<br/>




		<h1>Historique des magasins</h1><h2>Euros / Année 2011 / Tous indicateurs / Toutes régions</h2>
		<table cellspacing="0" cellpadding="0" border="1" class="tablesorter" style="width:870px;" id="myTable2" >
			 <thead>
		 <tr> 
			<th rowspan="2">Region</th>
			<th colspan="2">Chiffre d'affaires réel</th>
			 <th rowspan="2">CA_%</th>
			<th colspan="2">Marge brut réelle</th>
			 <th rowspan="2">MB_%</th>
			<th colspan="2">Vente réelle</th>    
			<th rowspan="2">VTS_%</th>
			<th rowspan="2">RG</th>
			<th rowspan="2">E M/M-1</th>
		  </tr>
		  <tr>
			
			<th>2011</th>
			<th>2010</th>
			<th>2011</th>
			<th>2010</th>
			<th>2011</th>
			<th>2010</th>
			
			
		  
		  </tr>
			 </thead>
		  <tbody>
		  <tr>
			<td class="gauche">Alencon</td>
			<td>13 426,80 </td>
			<td>20 440,00 </td>
			<td>65,7%</td>
			<td>13 426,80  </td>
			<td> 41,60  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1563</td>
			<td>&nbsp;</td>
			
			<td>1</td>
			<td>3</td>
		  </tr>
		  <tr>
			<td class="gauche">Amiens</td>
			<td>10 429,50 </td>
			<td>19 800,00 </td>
			<td>52,7%</td>
			<td>10 429,50  </td>
			<td>50,70  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1260</td>
			<td>&nbsp;</td>
			
			<td>6</td>
			<td>6</td>
		  </tr>
		  <tr>
			<td class="gauche">Angers</td>
			<td>8 515,20 </td>
			<td>13 420,00 </td>
			<td>63,5%</td>
			<td> 8 515,20  </td>
			<td> 34,60  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>221</td>
			<td>&nbsp;</td>
			
			<td>10</td>
			<td>7</td>
		  </tr>
		  <tr>
			<td class="gauche">Angouleme</td>
			<td>8 334,40 </td>
			<td>21 630,00 </td>
			<td>38,5%</td>
			<td>8 334,40  </td>
			<td>35,50  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1296</td>
			<td>&nbsp;</td>
		   
			<td>11</td>
			<td>-2</td>
		  </tr>
		  <tr>
			<td class="gauche">Bobigny</td>
			<td>8 077,40 </td>
			<td>18 950,00 </td>
			<td>42,6%</td>
			<td> 8 077,40  </td>
			<td> 55,30  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>895</td>
			<td>&nbsp;</td>
		   
			<td>12</td>
			<td>=</td>
		  </tr>
		  <tr>
			<td class="gauche">Cergy_Pontoise</td>
			<td>7 250,90 </td>
			<td>16 790,00 </td>
			<td>43,2%</td>
			<td>7 250,90  </td>
			<td>59,00  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>761</td>
			<td>&nbsp;</td>
		   
			<td>17</td>
			<td>3</td>
		  </tr>
		  <tr>
			<td class="gauche">Creteil</td>
			<td>7 138,90 </td>
			<td>18 670,00 </td>
			<td>38,2%</td>
			<td> 7 138,90  </td>
			<td> 68,10  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1228</td>
			<td>&nbsp;</td>
		  
			<td>19</td>
			<td>-4</td>
		  </tr>
		  <tr>
			<td class="gauche">Evry</td>
			<td>7 064,40 </td>
			<td>19 300,00 </td>
			<td>36,6%</td>
			<td>7 064,40  </td>
			<td>53,20  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1258</td>
			<td>&nbsp;</td>
			
			<td>20</td>
			<td>-2</td>
		  </tr>
		  <tr>
			<td class="gauche">Lille</td>
			<td>6 845,50 </td>
			<td>19 770,00 </td>
			<td>34,6%</td>
			<td>6 845,50  </td>
			<td>62,80  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1307</td>
			<td>&nbsp;</td>
			
			<td>22</td>
			<td>-6</td>
		  </tr>
		  <tr>
			<td class="gauche">Melun</td>
			<td>6 222,00 </td>
			<td>20 000,00 </td>
			<td>31,1%</td>
			<td>6 222,00  </td>
			<td>40,70  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1232</td>
			<td>&nbsp;</td>
			
			<td>26</td>
			<td>3</td>
		  </tr>
		  <tr>
			<td class="gauche">Nanterre</td>
			<td>5 845,90 </td>
			<td>18 190,00 </td>
			<td>32,1%</td>
			<td>5 845,90  </td>
			<td>45,50  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>859</td>
			<td>&nbsp;</td>
			
			<td>28</td>
			<td>=</td>
		  </tr>
		  <tr>
			<td class="gauche">Nantes</td>
			<td>5 612,60 </td>
			<td>20 340,00 </td>
			<td>27,6%</td>
			<td>5 612,60  </td>
			<td>54,10  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1535</td>
			<td>&nbsp;</td>
		   
			<td>31</td>
			<td>1</td>
		  </tr>
		  <tr>
			<td class="gauche">Paris_Nord</td>
			<td>5 378,10 </td>
			<td>17 340,00 </td>
			<td>31,0%</td>
			<td>5 378,10  </td>
			<td>29,50  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1029</td>
			<td>&nbsp;</td>
			
			<td>33</td>
			<td>-2</td>
		  </tr>
		  <tr>
			<td class="gauche">Paris_Sud</td>
			<td>5 333,50 </td>
			<td>21 330,00 </td>
			<td>25,0%</td>
			<td>5 333,50  </td>
			<td>48,60  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1492</td>
			<td>&nbsp;</td>
		   
			<td>34</td>
			<td>-6</td>
		  </tr>
		  <tr>
			<td class="gauche">Quimper</td>
			<td>4 847,50 </td>
			<td>12 870,00 </td>
			<td>37,7%</td>
			<td>4 847,50  </td>
			<td>50,00  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>175</td>
			<td>&nbsp;</td>
			
			<td>37</td>
			<td>-4</td>
		  </tr>
		  <tr>
			<td class="gauche">Rouen</td>
			<td>3 032,00 </td>
			<td>17 090,00 </td>
			<td>17,7%</td>
			<td>3 032,00  </td>
			<td>51,50  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>758</td>
			<td>&nbsp;</td>
			
			<td>44</td>
			<td>3</td>
		  </tr>
		  <tr>
			<td class="gauche">St_Brieuc</td>
			<td>1 896,30 </td>
			<td>19 410,00 </td>
			<td>9,8%</td>
			<td>1 896,30  </td>
			<td>58,00  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>1161</td>
			<td>&nbsp;</td>
			
			<td>46</td>
			<td>-2</td>
		  </tr>
		  <tr>
			<td class="gauche">Versailles</td>
			<td>787,70 </td>
			<td>21 640,00 </td>
			<td>3,6%</td>
			<td>787,70  </td>
			<td>67,70  </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>2345</td>
			<td>&nbsp;</td>
			
			<td>49</td>
			<td>-1</td>
		  </tr>
		  </tbody>
		  <tfoot>
		  <tr>
			<td>Total</td>
			<td>301 175,50 </td>
			<td>911 050,00 </td>
			<td>&nbsp;</td>
			<td>116 038,60 </td>
			<td>2 339,20 </td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
			<td>51823</td>
			<td>&nbsp;</td>
			<td>&nbsp;</td>
		   
			<td>&nbsp;</td>
		  </tr>
		   </tfoot>
		</table>
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				
				<div id="tab1">
						<div class="one-full" style=" opacity: 0.7;">
							<div id="historique_ca" style="width: auto; height: 400px"></div>	
						
						</div>
						<div class="one-full" style=" opacity: 0.7;">
							<div id="historique_ventes" style="width: auto; height: 400px"></div>	
						
						</div>		
						<div class="one-full" style=" opacity: 0.7;">
							<div id="historique_marges" style="width: auto; height: 400px"></div>	
						
						</div>	
						
								
						
				</div>
			
		
			</div><!-- Fin Div content --> 
			
		
		</div> <!-- Fin div middle -->
		<div id="footer" style="top:2280px;">
			<p>Entreprise DARTIES - 2011</p>                         		
		</div>	
		
	
	</div> <!-- Fin div page -->
</body>
</html>
